<template>
  <view>
    <view class="edit-nickname">
      <view class="title">绑定手机号</view>
      <view class="uni-form-item uni-column">
        <input class="uni-input"
               focus
               v-model="phone"
               placeholder="自动获得焦点" />
      </view>
    </view>

    <view class="btn">
      <button type="primary"
              style="margin-top:80upx"
              @click="clickPost">保存更改</button>
    </view>
  </view>
</template>
<script>
export default {
  data () {
    return {
      phone: this.$store.state.user_info.phone
    }
  },

  methods: {
    clickPost () {
      this.$myRequest('mine/edit', {
        phone: this.phone
      }, "POST").then((res) => {
        if (res.code == 1000) {
          let user_info = this.$store.state.user_info
          user_info.phone = this.phone
          this.$store.commit('setUserInfo', user_info)
          uni.navigateBack({ delta: 2 })
        }
      })
    }
  }
}
</script>
<style scoped lang="scss">
.edit-nickname {
  width: 100%;
  text-align: center;
  margin-top: 100upx;
  box-sizing: border-box;
  padding: 40upx;
  height: 100%;
  .title {
    font-size: 40upx;
  }
  .uni-input {
    margin-top: 60upx;
    background-color: #fff;
    padding: 20upx;
    font-size: 32upx;
  }
}

.btn {
  box-sizing: border-box;
  width: 100%;
  padding: 40upx;
  position: absolute;
  bottom: 80upx;
}
</style>